<template>
	<div>
		<template v-for="(item,index) in items">
			<el-submenu :index="item.url" v-if="item.children && item.children.length > 0" :key="index">
				<template slot="title">
					<i class="my-icon" :class="item.icon" ></i>
					<span v-if="!collapse">{{ item.name }}</span>
				</template>
				<subitem :items="item.children" />
			</el-submenu>
			<el-menu-item :index="item.url" @click='changeMenu(item)' v-else :key="index">
				<i class="my-icon" :class="item.icon"></i> 
				<span slot="title">{{ item.name}}</span>
			</el-menu-item>
		</template>
	</div>
</template>

<script>
export default {
	name:"subitem",
	props:{
		items:Array,
		collapse:Boolean
	},
    methods: {
        changeMenu(item) {}
    }
};
</script>

<style lang="less" scoped="scoped">
</style>
